﻿<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>城市客厅回放</title>
		<script type="text/javascript" src="js/jquery-2.1.1.min.js" ></script>
		<link rel="stylesheet" href="css/index.css" />
	</head>
	<body>
		<div class="yangbg"></div>
		<div class="conten">
			<div class="title"><img src="img/title.png" width="788" height="389"></div>
			<div class="vodbg">
				<div class="spbox">
					<!--<div id="id_video_container" style="width:100%;height:1px;"></div>-->
					<div id="play"></div>
				</div>
				<div class="pinglbox">
					<div class="liaot"><div></div>    <span>聊天</span></div>
					<div class="pingl">
						<div class="userliu">
							<div class="toux"><img src="img/4.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">阅读带来的乐趣</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/10.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">阅读带来的乐趣</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/11.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">阅读带来的乐趣</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/12.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">享受是如此让人陶醉,还可以能够培养自己的修养</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/13.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">阅读带来的乐趣</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/14.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">阅读带来的乐趣</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/15.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">阅读带来的乐趣</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/4.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">享受是如此让人陶醉,还可以能够培养自己的修养</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/4.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">阅读带来的乐趣</span></span>
							</div>
						</div>
						<div class="userliu">
							<div class="toux"><img src="img/4.png"></div>
							<div class="nameping">
								<span>城市客厅用户:<span class="sppin">阅读带来的乐趣</span></span>
							</div>
						</div>
					</div>
					<div class="pingipu">
						<div class="text_main">
							<textarea class="text_01" placeholder="写下你的精彩评论"></textarea>
						</div>
						<div class="btn_main">
							<button class="btn_01">发送</button>
						</div>
					</div>
				</div>
			</div>
			<div class="briefbox">
				<span>直播简介</span><br />
				<p>城市客厅是由汉博联合城市生态圈研究院与广州广播电视台G4、珏峰文化传媒集团联动社会各界精英共同发起的一个以推动社会可持续发展为核心的主题空间。围绕关键词“跨界”，我们致力为城市精英阶层营造一个畅所欲言的“家”。我们将通过全媒体联动、空间交流、线下体验等方式，聚积跨界、跨学科的城市精英参与互动，组成绿色生态城市服务的智库，为城市提供高端的智慧输出。第一期活动将结合“世界阅读日”主题，与各界精英共同研讨如何从各个方面构筑起一个生态化的“阅读的世界”，而这样的世界将会为我们未来的生活方式带来怎样的变化。</p>
			</div>
			<div class="logo"><img src="img/logo.png"></div>
		</div>
		<!--<script type="text/javascript" src="http://cdn.aodianyun.com/lss/player.js"></script>
		<script type="text/javascript">
		aodianPlayer({
		  container:'play',//播放器容器ID，必要参数
		  rtmpUrl:'rtmp://8742.lssplay.aodianyun.com/VideoOnair/stream',//控制台开通的APP rtmp地址，必要参数
		  hlsUrl:'http://8742.hlsplay.aodianyun.com/VideoOnair/stream.m3u8',//控制台开通的APP hls地址，必要参数
		  player:{
		    name:'lssplayer',//播放器名称，必要参数
		    /* 以下为可选参数*/
		    width: '692',//PC端浏览器，播放器宽度，可用数字、百分比等
		    height: '485',//PC端浏览器，播放器高度，可用数字、百分比等
		    html5Width: '100%',//手机端浏览器，播放器宽度，      可用数字、百分比等
		    html5Height: '100%',//手机端浏览器，播放器高度，可用数字、百分比等
		    autostart: true,//是否自动播放，默认为false
		    bufferlength: '1',//视频缓冲时间，默认为3秒，手机端不支持！
		    maxbufferlength: '2',//最大视频缓冲时间，默认为2秒，手机端不支持！
		    stretching: '2',//设置全屏模式,1代表按比例撑满至全屏,2代表铺满全屏,3代表视频原始大小,默认值为1
		    controlbardisplay: 'enable'//是否显示控制栏，值为：disable、enable默认为disable
		  }
		});
		/* 以下为LSS Player支持的事件 */
//		 	lssHandle.startPlay();
		/* lssHandle.pause();//暂停 */
		/* lssHandle.stopPlayer();//停止 */
		/* lssHandle.closeConnect();//断开连接 */
		/* lssHandle.setMute(true);//静音或恢复音量，参数为true|false */
		/* lssHandle.setVolume(volume);//设置音量，参数为0-100数字 */
		/* lssHandle.setFullScreenMode(1);//设置全屏模式,1代表按比例撑满至全屏,2代表铺满全屏,3代表视频原始大小,默认值为1,手机端不支持 */
		</script>             -->
		<script type="text/javascript" charset="utf-8" src="http://cdn.aodianyun.com/static/jquery/jquery-1.7.2.min.js"></script>
		<script type="text/javascript" charset="utf-8" src="http://cdn.aodianyun.com/lss/aodianplay/player.js"></script>
		<script type="text/javascript">
		  var w = "692";//视频宽度
		  var h = "485";//视频高度
		  var url = "http://8742.live-vod.cdn.aodianyun.com/m3u8/0x0/VideoOnair.stream.1461395938/VideoOnair.stream.1461395938.m3u8";//视频地址
		  var image = "http://cdn.dvr.aodianyun.com/pic/live-vod/images/VideoOnair.stream.1461395938/0/0";//封面图片
		  var objectPlayer=new aodianPlayer({
		      container:'play',//播放器容器ID，必要参数
		      hlsUrl: url,//控制台开通的APP hls地址，必要参数
		      /* 以下为可选参数*/
		      width: w,//播放器宽度，可用数字、百分比等
		      height: h,//播放器高度，可用数字、百分比等
		      autostart: true,//是否自动播放，默认为false
		      controlbardisplay: 'enable',//是否显示控制栏，值为：disable、enable默认为disable。
		      adveDeAddr: image,//封面图片链接
		      adveWidth: w,//封面图宽度
		      adveHeight: h,//封面图高度
		      //adveReAddr: ''//封面图点击链接
		  });
		</script>
	</body>
</html>